<?php session_start(); ?>

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>楚瑞涛的博客管理后台-博客管理</title>
  <link rel="stylesheet" href=<?php echo HOME_CSS.'layui.css' ?> media="all">
  <script type="text/javascript" src=<?php echo HOME_JS.'jquery.min.js' ?> ></script>
  <script src=<?php echo HOME_JS.'layui.js' ?> ></script>
  <style>
    .info-title{
      text-align: center;
      font-weight: bold;
      padding-bottom: 20px;
    }
    .info-item{
      padding: 5px 10px;
    }
    .info-item>input,.info-item>select{
      width:100px;
    }
    </style>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
  <div class="layui-header">
    <div class="layui-logo">楚瑞涛博客管理后台</div>
    <!-- 头部区域（可配合layui已有的水平导航） -->
    <ul class="layui-nav layui-layout-right">
      <li class="layui-nav-item">
        <a href="javascript:;">
        <img src=<?php echo $_SESSION['m_portrait'] ?>  class="layui-nav-img" alt="头像">
          楚瑞涛
        </a>
        <dl class="layui-nav-child">
          <dd><a href=<?php echo HOME_PATH.'index.php/User/getManAll' ?>>基本资料</a></dd>
          <dd><a href=<?php echo HOME_PATH.'index.php/User/getManagerPass' ?>>修改密码</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item"><a onclick="exit_login()" href="javascript:;">退出</a></li>
    </ul>
  </div>

  <div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
      <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
      <ul class="layui-nav layui-nav-tree"  lay-filter="test">
        <li class="layui-nav-item">
          <a class="" href="javascript:;">用户管理
            <span class="layui-nav-more"></span>
          </a>
          <dl class="layui-nav-child">
            <dd><a href=<?php echo HOME_PATH.'index.php/User/getUserAll' ?>>用户管理</a></dd>
            <!-- <dd><a href="javascript:;">权限申请管理</a></dd> -->
          </dl>
        </li>
        <li class="layui-nav-item layui-nav-itemed">
          <a href="javascript:;">博客管理
            <span class="layui-nav-more"></span>
          </a>
          <dl class="layui-nav-child">
            <dd class="layui-this"><a href=<?php echo HOME_PATH.'index.php/Blog/getBlogAll' ?>>博客管理</a></dd>
            <dd><a href=<?php echo HOME_PATH.'index.php/Type/getTypeAll' ?>>类别管理</a></dd>
            <dd><a href=<?php echo HOME_PATH.'index.php/Target/getTargetAll' ?>>标签管理</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item">
            <a href="javascript:;">评论管理</a>
            <dl class="layui-nav-child">
              <dd><a href=<?php echo HOME_PATH.'index.php/Comment/getCommentAll' ?> >评论管理</a></dd>
              <dd><a href=<?php echo HOME_PATH.'index.php/Reply/getReplyAll' ?> >追评管理</a></dd>
            </dl>
        </li>
        <li class="layui-nav-item">
            <a href="javascript:;">系统设置</a>
            <dl class="layui-nav-child">
              <dd><a href=<?php echo HOME_PATH.'index.php/User/getManAll' ?> >个人信息</a></dd>
              <dd><a href=<?php echo HOME_PATH.'index.php/User/getManagerPass' ?> >修改密码</a></dd>
            </dl>
        </li>
      </ul>
    </div>
  </div>

  <!-- setUser -->
  <div class="layui-form layui-form-pane" id="setBlog" style="display:none">
  <!-- 设置用户  -->
    <h3 class="info-title">设置博客</h3>
    <form class="layui-form">
      <div class="layui-form-item">
        <label class="layui-form-label">博客标题：</label>
        <div class="layui-input-block">
          <input type="text" name="title" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">阅读数量：</label>
        <div class="layui-input-block">
          <input type="text" name="reader" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">博客类型：</label>
        <div class="layui-input-block">
          <select name="type" lay-verify="required" lay-search>
            <option value="">请选择一个类型</option>
          </select> 
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">点赞数量：</label>
        <div class="layui-input-block">
          <input type="text" name="praise" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">博客状态：</label>
        <div class="layui-input-block">
          <input type="checkbox" name="state" lay-skin="switch" lay-text="公开|私密">
        </div>
      </div>
    </form>
  </div>
  
  <div class="layui-body">
    <!-- 内容主体区域 -->
    <div style="padding: 15px;">
      <form class="layui-form" action="">
        <div class="layui-form-item">
          搜索标题：
          <div class="layui-inline">
          <input type="text" id="key" name="key" required lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
        </div>
        <button class="layui-btn layui-btn-normal" onclick="return false;" data-type="reload" id="search" >搜索</button>
        <a class="layui-btn layui-btn" href="/blog_system/admin/view/publishBlog.php">写博客</a>
        <button class="layui-btn layui-btn-primary " onclick="return false;" id="refresh"  data-type="reload" >刷新</button>
        </div>
      </form>
      <table class="layui-hide" id="blog_info" lay-filter="blog_info"></table>
        
      <script type="text/html" id="blogBar">
          <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
          <a class="layui-btn layui-btn-xs" lay-event="set">设置</a>
          <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">修改</a>
          <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="simi">私密</a>
      </script>
    </div>
  </div>
  
<script>
 //退出登陆
 function exit_login(){
    layer.alert('确定要退出嘛？',{
      // skin: 'layui-layer-rim' //样式类名 /layui-layer-molv  layui-layer-lan   layui-layer-rim
      closeBtn: 1    // 是否显示关闭按钮
      ,anim: 1 //动画类型
      ,btn: ['退出','取消'] //按钮
      ,icon: 3    // icon\
      ,title:"退出"
      ,yes:function(){
        $.ajax({
          url:'/blog_system/admin/index.php/Login/exitLogin',
          type:'POST',
          contentType: "application/x-www-form-urlencoded;charset=utf-8",
          success:function(result){
            console.log(result);
            if(result == 1){
              layer.msg('退出登陆成功',{icon: 6, time: 2000});
              $(":root").delay(2000).queue(function(){ window.location.href="/blog_system/admin/index.php"; });   //阿里云搜索跳转
            }else{
              layer.msg('退出登陆失败，请刷新后重试',{icon:5, time: 2000});
            }
          }
        });
      }
    });
  }
  //使用 layui 组件
  layui.use(['element','table',"layer",'form'], function(){
    var form = layui.form;
    var table = layui.table;
    var layer = layui.layer,$=layui.$;
    var element = layui.element;
    
    table.render({
      elem: '#blog_info'
      ,url:'/blog_system/admin/index.php/Blog/getBlogsJson'
      ,title: '博客数据表'
      ,toolbar: 'default'      //以后再写
      ,cellMinWidth: 120 //全局定义常规单元格的最小宽度
      ,cols: [[
          {type: 'checkbox', fixed: 'left'}
          ,{field:'blog_id', title:'编号', width:80, unresize: true, type:'numbers'}
          ,{field:'username', title:'用户', align: 'center', width:150}
          ,{field:'title', title:'标题', align: 'center'}
          ,{field:'time', title:'发表时间', align: 'center', width:200}
          ,{field:'reader', title:'阅读数量', align: 'center', sort: true, width:120 }
          ,{field:'type_name', title:'博客类型', align: 'center', sort: true, width:120 }
          ,{field:'praise_count', title:'点赞数量', align: 'center', sort: true, width:120 }
          ,{field:'state', title:'状态', align: 'center', sort: true, width:100}
          ,{fixed: 'right', title:'操作', toolbar: '#blogBar', align: 'center', width:250}
      ]]
      ,height: 'full-220'   //高度自适应
      ,limit:15
      ,page: {
        layout: [ 'prev', 'page', 'next', 'count','skip'] //自定义分页布局
        ,curr: 1 
        ,first: '首页' //显示首页
      }
    });
    $("#refresh").on('click',function(){
      table.reload('blog_info');
    });
    //点击搜索按钮根据用户名称查询
	  $('#search').on('click',function(){
      if($('#key') == ''){
        return;
      }
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });
    //根据条件查询表格数据重新加载
	  var $ = layui.$, active = {
		    reload: function(){
		    //获取用户名
		      var title = $('#key');
		      //执行重载
		      table.reload('blog_info', {
		        page: {
		          layout: [ 'prev', 'page', 'next', 'count','skip'] //自定义分页布局
              ,curr: 1 
              ,first: '首页' //显示首页
		        }
            ,where: {       //根据条件查询
		        	title:title.val()
		        }
		      });
		   }
		};

     //监听头工具栏事件
    table.on('toolbar(blog_info)', function(obj){
      var checkStatus = table.checkStatus(obj.config.id)
      ,data = checkStatus.data; //获取选中的数据
      switch(obj.event){
        case 'add':
          window.location.href='/blog_system/admin/view/publishBlog.php';
        break;
        case 'update':
          if(data.length === 0){
            layer.msg('请选择一行',{icon: 7, time: 2000});
          } else if(data.length > 1){
            layer.msg('只能同时编辑一个',{icon: 7, time: 2000});
          } else {
            window.location.href="/blog_system/admin/index.php/Blog/editBlogInfo/id/"+checkStatus.data[0].blog_id     //跳转修改页面
          }
        break;
        case 'delete':
          if(data.length === 0){
            layer.msg('请选择一行',{icon: 7, time: 2000});
          }else if(data.length > 1 ){
            layer.msg('一次最多删除1个',{icon: 7, time: 2000});
          } else {
            layer.alert('真的删除选中的数据吗？<br>删除后数据将不可恢复！！',{
              closeBtn: 1    // 是否显示关闭按钮
              ,anim: 6 //动画类型
              ,btn: ['确定','取消'] //按钮
              ,icon: 3    // icon
              ,title:"删除"
              ,yes:function(index){
                var data = checkStatus.data;
                dataInfo = {
                  blog_id : data[0].blog_id
                } 
                $.ajax({
                  url:'/blog_system/admin/index.php/Blog/delBlog',
                  type:'POST',
                  contentType: "application/x-www-form-urlencoded;charset=utf-8",
                  data:dataInfo,
                  success:function(result){
                    if(result){
                      var data = JSON.parse(result);
                      console.log(data.code);
                      if(data.code == 1){
                        layer.msg('删除成功',{icon: 6, time: 2000});
                        $(".layui-laypage-btn")[0].click();       //刷新当前页面数据
                      }else{
                        layer.msg('删除失败',{icon: 7, time: 2000});
                      }
                      return ; 
                    }
                    layer.msg('删除失败',{icon: 5, time: 2000}); 
                  }
                });
              }
            });
          }
        break;
      }
    });
    //监听工具条
    table.on('tool(blog_info)', function(obj){
      var blogInfo = obj.data;
      console.log(blogInfo);
      if(obj.event === 'detail'){
        window.open("/blog_system/admin/index.php/Blog/getBlog/id/"+blogInfo.blog_id);
      } else if(obj.event === 'set'){
        layer.open({
          title: '设置'  
          ,btn: ['修改','取消'] //按钮
          ,area: ['460px', '500px']
          ,anim: 1 //动画类型 
          ,content:$('#setBlog').html()
          ,success: function(layero, index){
            //请求文章类型
            $.ajax({
                async:true,     //异步请求
                url:'/blog_system/admin/index.php/Type/getTypesJson?state=normal',
                type:'POST',
                contentType: "application/x-www-form-urlencoded;charset=utf-8",
                success:function(result){
                    var data = JSON.parse(result).data;
                    var len = data.length;
                    for(var i=0;i<len;i++){
                      layero.find('select[name="type"]').append('<option value='+data[i].id+'>'+data[i].name+'</option>');
                    }
                    layero.find('select[name="type"]').val(blogInfo.type_id);
                    form.render('select');    //重新渲染 
                }
            })
            layero.find('input[name="title"]').val(blogInfo.title);
            layero.find('input[name="reader"]').val(blogInfo.reader);
            layero.find('input[name="praise"]').val(blogInfo.praise_count);
            if(blogInfo.state=='公开')
              layero.find('input[name="state"]').prop("checked",true);
            form.render();    //重新渲染 from 组件
          }
          ,yes:function(index,layero){ 
            var title = layero.find('input[name="title"]').val().trim();
            var reader = layero.find('input[name="reader"]').val().trim();
            var praise = layero.find('input[name="praise"]').val().trim();
            var blog_type = layero.find('select[name="type"]').val();
            var type_name = layero.find('option[value="'+blog_type+'"]').text();                        //获取的是全部的值，需要修改成 id 对应的值
            var state = layero.find('input[name="state"]').prop("checked")?1:0;
            var rex = /[\u4e00-\u9fa5_a-zA-Z0-9]{1,60}/;
            if(title==''){
              alert('博客标题不能为空！');
              return ;
            }
            if(!rex.test(title)){
              alert('博客标题只能输入中文、英文、数字及下划线且不能超过60！');
              return ;
            }
            var re = /^[0-9]*[1-9][0-9]*$/;
            if(!re.test(reader)){
              alert('请输入正确的阅读数量');
              return;
            }
            if(!re.test(praise)){
              alert('请输入正确的点赞数量');
              return;
            }
            datainfo={
              title:title,
              reader:reader,
              blog_type:blog_type,
              praise_count:praise,
              state:state,
              id:blogInfo.blog_id
            }
            console.log(datainfo);
            $.ajax({
              url:'/blog_system/admin/index.php/Blog/editBlog',
              type:'POST',
              data:datainfo,
              contentType: "application/x-www-form-urlencoded;charset=utf-8",
              success:function(result){
                if(result){
                  console.log(result);
                  var data = JSON.parse(result);
                  if(data.code){
                    blogInfo.type_id=blog_type;         //未结束设置博客类型回显
                    obj.update({      //更新表格数据
                      'title':title,
                      'reader':reader,
                      'type_name':type_name,
                      'praise_count':praise,
                      'state':state==1?'公开':'私密'
                    });
                    layer.msg('修改成功',{icon: 6, time: 2000});
                  }else{
                    layer.msg('修改失败，数据没有变化',{icon: 7, time: 2000});
                  }
                  return ; 
                }
                layer.msg('修改失败',{icon: 5, time: 2000}); 
              }
            });
          }
        });
      } else if(obj.event === 'simi'){         //设置私密按钮
        layer.alert('确定将这篇博客设置为私密嘛？',{
          // skin: 'layui-layer-rim' //样式类名 /layui-layer-molv  layui-layer-lan   layui-layer-rim
          closeBtn: 1    // 是否显示关闭按钮
          ,anim: 1 //动画类型
          ,btn: ['确定','取消'] //按钮
          ,icon: 3    // icon\
          ,title:"设为私密"
          ,yes:function(index){
            if(blogInfo.state == '私密'){
              layer.msg('该博客已经为私密了',{icon: 7, time: 2000});
              return;
            }
            $.ajax({
              url:'/blog_system/admin/index.php/Blog/setBlogPrivate/id/'+blogInfo.blog_id,
              type:'POST',
              contentType: "application/x-www-form-urlencoded;charset=utf-8",
              success:function(result){
                if(result){
                  var data = JSON.parse(result);
                  console.log(data.code);
                  if(data.code == 1){
                    layer.msg('设置成功',{icon: 6, time: 2000});
                    obj.update({      //更新表格数据
                      'state':'私密'
                    });
                  }else{
                    layer.msg('该博客已经为私密了',{icon: 7, time: 2000});
                  }
                  return ; 
                }
                layer.msg('设置失败',{icon: 5, time: 2000}); 
              }
            });
          }
        });
      }else if(obj.event === 'edit'){
        window.location.href="/blog_system/admin/index.php/Blog/editBlogInfo/id/"+blogInfo.blog_id     //跳转修改页面
      }
    });
  });
</script>
  <div class="layui-footer">
    <!-- 底部固定区域 -->
    &copy; 河南科技学院-三月小组
  </div>
</div>  
</body>
</html>